<!-- 教练 – 首页 – 约课详情 – 课程详情 – 学员详情 – 点评		remark -->
<template>
	<view class="warps">
		<view class="warps_box">
			<view class="content">
				<view class="charts-box">
					<qiun-data-charts type="radar" :chartData="chartData" :errorShow="false" background="none" />
				</view>
			</view>
		</view>
		<view class="teaching-top">
			<view class="w90" >
				<view class=" f b c" @click="get()">
					<view>
						<text>选项1</text>
					</view>
					<view class="vw20 f b c">
						<lauwen-select :options="options" :defaultIndex="'one'" :height="45" :padding="15" :fontSize="'1rem'" @getValue="getValue"></lauwen-select>
						<image style="width: 24rpx;height: 24rpx;" src="../../../static/img/028.png" mode=""></image>
					</view>
				</view>
				<view class="quanxian m_t_30"></view>
			</view>
			<view style="position:relative;">
				<view class="w90" >
					<view class=" f b c" @click="geta()">
						<view>
							<text>选项1</text>
						</view>
						<view class="vw20 f b c">
							<lauwen-select :options="optionsa" :defaultIndex="'one'" :height="45" :padding="15" :fontSize="'1rem'" @getValue="getValue"></lauwen-select>
							<image style="width: 24rpx;height: 24rpx;" src="../../../static/img/028.png" mode=""></image>
						</view>
					</view>
					<view class="quanxian m_t_30"></view>
				</view>
				<view class="w90" style="position:absolute;left:40rpx;">
					<textarea style="font-size:24rpx;" value="" placeholder="" />
				</view>
			</view>
			<view class="w90" style="margin-top:240rpx;">
				<view class="quanxian"></view>
				<view class="p_t_40 vw45 f b c">
					<text class="fs32 bold">备注</text>
					<text class="fs24">备注备注备注备注</text>
				</view>
			</view>
		</view>
		<view class="remark-top">
			<button type="default">提交</button>
		</view>
	</view>
</template>

<script>
	import lauwenSelect from "@/components/lauwen-select/lauwenSelect.vue"
	export default {
		 components: {
		        lauwenSelect
		    },
		data() {
			return {
				show: false,
				showa: false,
				showb: false,
				showc: false,
				showd: false,
				chartData: {
					"categories": [
						"B",
						"F",
						"B",
						"C"
					],
					"series": [{
						"name": "",
						"data": [
							90,
							110,
							165,
							195
						]
					}]
				},
				options: {
				    'one': "one",
				    'two': "two",
				    'three': "three",
				},
				optionsa: {
				    'one': "one1",
				    'two': "two2",
				    'three': "three3",
				}
			}
		},
		onLoad() {
			// 动态导航条文字
			uni.setNavigationBarTitle({
				title: '点评学员情况'
			})
		},
		methods: {
			getValue(index) {
			    console.log(index)
			},
			get() {
				this.show = !this.show
			},
			geta() {
				this.showa = !this.showa
			},
			getb() {
				
				this.showb = !this.showb
		
			},
			getc() {
				
				this.showc = !this.showc
			
			},
			getd() {
				
				this.showd = !this.showd
				
			},
		}
	}
</script>

<style scoped>
	.warps {
		/* height: 200vh; */
		overflow: hidden;
		background-color: #F6F8FC;
	}
	.content{
		width:404rpx;
		height:404rpx;
	}
	/* 雷达图 */
	.charts-box {
		width: 100%;
		height:404rpx;
	}
	.warps_box{
		width: 686rpx;
		height: 400rpx;
		background: #ffffff;
		border-radius: 16rpx;
		box-shadow: 0rpx 0rpx 12rpx 0rpx rgba(0,0,0,0.12); 
		margin:0 auto;
		margin-top:30rpx;
	}
	.teaching-top{
		width: 686rpx;
		height: 698rpx;
		background: #ffffff;
		border-radius: 16rpx;
		box-shadow: 0rpx 0rpx 12rpx 0rpx rgba(0,0,0,0.12); 
		margin:0 auto;
		margin-top:30rpx;
		padding-top:15rpx;
	}
	.teaching-lan{
		width: 260rpx;
		height: 250rpx;
		opacity: 1;
		background: #f1f6ff;
		border-radius: 8rpx;
		margin-left:450rpx;
	}
	.remark-top{
		margin-top:62rpx;
	}
	.remark-top>button{
		width: 502rpx;
		height: 72rpx;
		line-height:72rpx;
		opacity: 1;
		background: #1f73f2;
		border-radius: 8rpx;
		color:#fff;
		font-size:32rpx;
	}
</style>

